<!-- 远程会诊订单 -->
<template>
  <div class="doctorreviewlist">
    <Row>
      <Col :xs="24">
        <div class="margin-up-down">
          <span>申请编号:</span>
          <Input class="w-input" v-model="filterObj.applyCode" placeholder="请输入申请编号" style='width: 150px;'/>
        </div>
        <div class="margin-up-down">
          <span>患者姓名:</span>
          <Input class="w-input" v-model="filterObj.memberName" placeholder="请输入患者姓名" style='width:150px;'/>
        </div>
        <div class="margin-up-down">
          <span>申请机构:</span>
          <Input class="w-input" v-model="filterObj.applyHospitalName" placeholder="请输入申请机构名称" style='width:150px;'/>
        </div>
        <div class="margin-up-down">
          <span>申请医生:</span>
          <Input class="w-input" v-model="filterObj.applyDoctorName" placeholder="请输入申请医生" style='width:150px;'/>
        </div>
        <div class="margin-up-down">
          <span>会诊类型:</span>
          <Select class="w-select" clearable v-model="filterObj.conMold" style='width:150px;'>
            <Option v-for="(item,index) in statusList" :value="index" :key="index" style='text-align:center'>{{item}}</Option>
          </Select>
        </div>
      </Col>
      <Col :xs="24">
        <div class="margin-up-down">
          <span>时间类型:</span>
          <Select class="w-select" clearable v-model="timestatus" style='width:100px;'>
            <Option :value="1" style='text-align:center'>申请时间</Option>
            <Option :value="2" style='text-align:center'>会诊时间</Option>
          </Select>
        </div>
        <div class="margin-up-down">
          <span>{{ timestatus === 1 ? '申请时间' : '会诊时间' }}:</span>
          <DatePicker
            type="date"
            :clearable="false"
            @on-change="changeStart"
            v-model="startDate"
            placeholder="开始日期"
            format="yyyy-MM-dd"
            style="width: 200px"
          ></DatePicker>
          <span>至</span>
          <DatePicker
            type="date"
            :clearable="false"
            @on-change="changeEnd"
            v-model="endDate"
            placeholder="结束日期"
            format="yyyy-MM-dd"
            style="width: 200px"
          ></DatePicker>
        </div>
        <div class="margin-up-down">
          <span>会诊状态:</span>
          <Select class="w-select" clearable v-model="filterObj.conStatus" style='width:100px;'>
            <Option v-for="(item, index) in zhuangtai" :key="index" :value="index" style='text-align:center' v-show="item !== '全部'">{{ item }}</Option>
          </Select>
        </div>
        <div class="margin-up-down">
          <Button type="primary" @click="loadsrach()">
            <Icon size="14"/>查询
          </Button>
          <Button @click="loadnodePage(1)">
            <Icon size="14"/>重置
          </Button>
        </div>
      </Col>
    </Row>
    <Table class="m-table" stripe :columns="columns" :data="orderList"></Table>
    <Page :total="count" :current="filterObj.pageNo" :page-size="filterObj.pageSize" @on-change="loadPage"/>
  </div>
</template>
<script>
import { DatePicker } from "view-design";
import api from "@/api/commonApi";
import Utils from "@/utils";
const filterObj = {
  pageSize: 10,
  pageNo: 1,
  applyCode: null,
  memberName: null,
  applyHospitalName: null,
  applyDoctorName: null,
  conMold: null,
  conStatus: null,
};
export default {
  data() {
    return {
      startDate: "",
      endDate: "",
      count: 0,
      timestatus: 1,
      statusList: [
        "临床会诊",
        "影像诊断",
        "心电诊断",
        "病理诊断",
        "远程示教",
        "精准医疗",
        "卒中急救",
        "病理讨论",
        "护理会诊",
        "远程门诊",
        "检验诊断"
      ],
      zhuangtai: [
        "全部",
        "已保存",
        "已撤销",
        "待审核",
        "被拒绝",
        "待分诊",
        "待会诊",
        "报告中",
        "报告审核中",
        "已完成",
        "报告被驳回",
        "待支付",
        "已关闭"
      ],
      columns: [
        { type: "index", title: "排序", width: 60, align: "center" },
        {
          title: "申请编号",
          key: "applyCode",
          align: "center"
        },
        {
          title: "会诊类型",
          key: "serviceType",
          align: "center",
          render: (h, params) => {
            let status = params.row.conMold;
            return h("span", {}, this.statusList[status]);
          }
        },
        {
          title: "患者姓名",
          key: "memberName",
          align: "center"
        },
        {
          title: "联系电话",
          key: "phoneNumber",
          align: "center"
        },
        {
          title: "申请医生",
          key: "applyDoctorName",
          align: "center",
          width: 120
        },
        {
          title: "申请机构",
          key: "applyHospitalName",
          align: "center",
          width: 120
        },
        {
          title: "申请日期",
          key: "createTime",
          align: "center",
          width: 120
        },
        {
          title: "会诊模式",
          key: "conMode",
          align: "center",
          width: 120,
          render: (h, params) => {
            let status = params.row.conMode;
            return status === 0 ? '单方' : '多方'
          }
        },
        {
          title: "平急诊",
          key: "conType",
          align: "center",
          width: 120,
          render: (h, params) => {
            let status = params.row.conMode;
            return status === 0 ? '平诊' : '急诊'
          }
        },
        {
          title: "会诊时间",
          key: "conTime",
          align: "center",
          width: 100
        },
        {
          title: "状态",
          key: "conStatus",
          align: "center",
          render: (h, params) => {
            let status = params.row.conStatus;
            return h("span", {}, this.zhuangtai[status]);
          }
        },
        {
          title: "操作",
          key: "operate",
          align: "center",
          width: 80,
          render: (h, params) => {
            let id = params.row.serviceId;
            let startDate = new Date(this.startDate);
            let endDate = new Date(this.endDate);
            startDate = startDate.toLocaleDateString().replace(/\//g, "-");
            endDate = endDate.toLocaleDateString().replace(/\//g, "-");
            return h(
              "a",
              {
                attrs: {
                  href: "javascript:void(0);"
                },
                on: {
                  click: () => {
                    this.handleDetail(params)
                  }
                }
              },
              "查看"
            );
          }
        }
      ],
      orderList: [],
      filterObj: this.deepClone(filterObj)
    };
  },
  components: {
    DatePicker
  },
  created() {
    // 上来就加载第一页数据
    let breadList = [
      { path: "/index", title: "首页" },
      {
        path: "/index/operation/ordersmanagement/index",
        title: "订单管理中心"
      },
      {
        path: "/index/operation/orders/consultingorder/list",
        title: "远程会诊订单"
      }
    ];
    this.$emit("changeBreadList", breadList);
  },
  mounted() {
    this.prescriptionSearchPage()
  },
  methods: {
    loadsrach() {
      // 查询
      this.filterObj.pageNo = 1;
      this.prescriptionSearchPage()
    },
    loadnodePage() {
      // 重置
      this.startDate = ''
      this.endDate = ''
      this.filterObj = this.deepClone(filterObj);
      this.prescriptionSearchPage();
    },
    loadPage(index) {
      // 分页
      this.filterObj.pageNo = index;
      this.prescriptionSearchPage()
    },
    changeStart(val) {
      // 开始时间
      this.startDate = val;
    },
    changeEnd(val) {
      // 结束时间
      this.endDate = val;
    },
    // 加载列表数据
    prescriptionSearchPage() {
      // 远程会诊订单列表
      const reqData = this.deepClone(this.filterObj);
      if (this.timestatus === 1) {
        reqData.applyTimeStart =  Utils.getNowDateBySpecialFormat(this.startDate);
        reqData.applyTimeEnd =  Utils.getNowDateBySpecialFormat(this.endDate);
      } else {
        reqData.conTimeStart =  Utils.getNowDateBySpecialFormat(this.startDate);
        reqData.conTimeEnd =  Utils.getNowDateBySpecialFormat(this.endDate);
      }
      this.$axios.post(api.shenqfindListByRemoteConsultOrder, reqData).then(resp => {
        if (resp.data.success) {
          let tmpObj = resp.data.object;
          this.count = parseInt(tmpObj.count);
          this.orderList = tmpObj.list;
        } else {
          this.$Message.info("网络错误，请刷新重试");
        }
      })
    },
    handleDetail(row) {
      // 查看详情
      this.functionJS.queryNavgationTo(this, "/index/operation/orders/diagnosis/detail/" + row.row.conStatus);
      sessionStorage.setItem('diagsisList', JSON.stringify(row.row))
    },
    deepClone(obj) {
      return JSON.parse(JSON.stringify(obj));
      this.prescriptionSearchPage()
    }
  }
};
</script>
<style lang="less" scoped>
  .doctorreviewlist {
    margin-left: 1%;
    padding: 10px;
    width: 98%;
    background: #ffffff;
    box-sizing: border-box;
    .w-select {
      width: 100px;
    }
    .w-input {
      width: 220px;
    }
    .w-num-input {
      width: 100px;
    }
    .m-table {
      margin: 10px 0;
    }
    .first {
      display: inline-block;
      min-width: 320px;
      text-align: right;
    }
    .second {
      display: inline-block;
      min-width: 150px;
      text-align: left;
    }
    .third {
      display: inline-block;
      min-width: 460px;
      text-align: center;
    }
    .margin-up-down {
      display: inline-block;
      margin: 10px 0;
    }
  }
</style>
<!--// let code = {-->
<!--//   pageNo: 1,-->
<!--//   pageSize: 100-->
<!--// }-->
<!--// this.$axios.post(api.shenqfindKbaoHospitalEntityList, code).then(resp => {-->
<!--//   // 申请机构-->
<!--//   if (resp.data.code === 1) {-->
<!--//     this.inquiryType = resp.data.object.list-->
<!--//   } else {-->
<!--//     this.$Message.info(resp.data.message);-->
<!--//   }-->
<!--// })-->
